<template>
	<view class="container">
		<view class="hidden-title">停电申请信息</view>
		<view class="background-white">
			<view class="flex text bor-btm">
				作业票编号：<text>{{ data.ticketCode }}</text>
			</view>
			<view class="flex text bor-btm">
				分厂：<text>{{ data.secondFactoryName }}</text>
			</view>
			<view class="flex text bor-btm">
				工段/区域：<text>{{ data.areaName }}</text>
			</view>
			<view class="flex text bor-btm">
				设备：<text>{{ data.deviceName }}</text>
			</view>
			<view class="flex text bor-btm">
				工作内容：<text>{{ data.content }}</text>
			</view>
			<view class="flex text bor-btm">
				电压：<text>{{ data.electricNum + data.electricUnit }}</text>
			</view>
			<view class="flex text bor-btm">
				停电申请：<text>{{ data.stopApplyUserName }}</text>
			</view>
		</view>
		<view class="background-white bor-top" v-if="data.stopUserName">
			<view class="flex text bor-btm" v-if="data.stopConfirmTime">
				停电确认：<text>{{ data.stopConfirmTime }}</text>
			</view>
			<view class="flex text bor-btm">
				停电人：<text>{{ data.stopUserName }}</text>
			</view>
			<view class="flex text bor-btm" v-if="data.stopRemark">
				停电备注：<text>{{ data.stopRemark }}</text>
			</view>
		</view>
		<view class="background-white bor-top" v-if="data.startApplyUserName">
			<view class="flex text bor-btm">
				送电时间：<text>{{ data.startTime }}</text>
			</view>
			<view class="flex text bor-btm">
				送电申请：<text>{{ data.startApplyUserName }}</text>
			</view>
		</view>
		<view class="background-white bor-top" v-if="data.startUserName">
			<view class="flex text bor-btm" v-if="data.startConfirmTime">
				送电确认：<text>{{ data.startConfirmTime }}</text>
			</view>
			<view class="flex text bor-btm">
				送电人：<text>{{ data.startUserName }}</text>
			</view>
			<view class="flex text bor-btm" v-if="data.startRemark">
				送电备注：<text>{{ data.startRemark }}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getElectricDetail
	} from '@/api/spw/powerCut.js';
	export default {
		onLoad({
			ticketId
		}) {
			this.ticketId = Number(ticketId);
			this.getDetail();
		},
		onNavigationBarButtonTap() {
			uni.navigateTo({
				url: '/pages/jobSlip/power-cut/approveRecord?ticketId=' + this.ticketId,
			});
		},
		data() {
			return {
				ticketId: '',
				data: {},
			};
		},
		methods: {
			getDetail() {
				getElectricDetail(this.ticketId).then((res) => {
					this.data = res.data;
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.container {
		.background-white {
			background-color: #fff;
			padding: 20rpx 30rpx;
			box-sizing: border-box;

			.uni-forms-item__label {
				color: #333;
				font-size: 30rpx;
			}

			.bor-btm {
				display: flex;
				border-bottom: 1px solid #d5d7e3;
			}

			.photo {
				display: flex;
				justify-content: space-between;

				image {
					width: 214rpx;
					height: 214rpx;
				}
			}

			.text {
				padding-bottom: 20rpx;
				padding-top: 4rpx;
				color: #333;

				text {
					color: #666;
				}
			}
		}
	}

	.hidden-title {
		background: #f5f5f5;
		padding: 20rpx;
		color: #999;
	}

	.bor-top {
		border-top: 20rpx solid #f5f5f5;
	}

	.submit-group {
		background: #fff;
		z-index: 9;
		padding: 30px;
	}

	.u-button {
		width: 600rpx;
	}
</style>
